<template>
	<div>
		<div class="top" v-if="manager.userName">
			<h3 class="header-title clearfix">
				<span></span>
				<p>招聘管理员</p>
			</h3>
			<div class="top-msg clearfix">
				<span>姓名：{{manager.userName}}</span>
				<span>手机号码：{{manager.phone}}</span>
			</div>
		</div>
		<!-- 导航栏 -->
		<comNavTabs :navList="navList" @switch="tabSwitch"></comNavTabs>
		<!-- 数据展示的列表 -->
		<comTable :options="tableList"	
		></comTable>
	</div>
</template>

<script>
export default{
	components:{
		comNavTabs: () => import("./comNavTabs.vue"),
		comTable: () => import("./comTable.vue"),
	},
	data(){
		return {
			/* 管理员信息 */
			manager:{
				userName: '张三',							//管理员姓名
				phone: '13434343434',						//管理员手机号码
			},
			/* 导航栏列表数据 */
			navList:{
				index:0,									//当前是在哪个tab栏
				data:[
					{title:'招聘中'},
					{title:'已下架'}
				]	
			},
			tableList:{
				list:[
					{title:'岗位名称',prop:'positionName',isClick:false},
					{title:'发布时间',prop:'createTime',isClick:false},
					{title:'工作地址',prop:'address',isClick:false},
					{title:'招聘人数',prop:'recruitNum',isClick:false},
					{title:'招聘管理员',prop:'recruitManager',isClick:false}
				],
				noOperation:true,	//是否有操作项
				operation:[			//操作项内容
					{name:'查看',isBtn:false,title:'openExamine'},
					{name:'下架',isBtn:false,title:'openExamine'}
				],
				data:[				//请求到的表格数据
					{
						positionName: '月嫂',					//岗位名称
						createTime: '2020-8-11',				//发布时间
						address: '上海市-闵行区-强劲大厦',			//工作地址
						recruitNum: 3,							//招聘人数
						recruitManager: '李四',					//招聘管理员
					},
					{
						positionName: '月嫂',					//岗位名称
						createTime: '2020-8-11',				//发布时间
						address: '上海市-闵行区-强劲大厦',			//工作地址
						recruitNum: 3,							//招聘人数
						recruitManager: '李四',					//招聘管理员
					},
				]
			},
		}
	},
	methods:{
		// 获取数据列表
		getListData(){
			
		},
		// tab栏切换
		tabSwitch(index){
			console.log(index);
			this.navList.index = index;
			if(index == 0){
				this.tableList.operation = [			
					{name:'查看',isBtn:false,title:'openExamine'},
					{name:'下架',isBtn:false,title:'openExamine'}
				];
			}else{
				this.tableList.operation = [			
					{name:'查看',isBtn:false,title:'openExamine'}
				];
			}
		},
		
	}
}
</script>

<style scoped="scoped">
.top{
	margin: 20px 35px;
}
.header-title{
	padding: 0 0 20px 0;
}
.header-title span{
	width: 15px;height: 20px;background-color: #0064E4;
	margin: 5px 10px 5px 0;float: left;
}
.header-title p{
	float: left;font-weight: bold;line-height: 30px;
}
.top-msg span{
	float: left;margin: 0 50px 0 25PX;
}
</style>
